<template>
  <div>
    <el-container style=" border: 1px solid #eee">
      <el-aside width="100px" style="background-color: rgb(238, 241, 246)">
        <el-menu :default-openeds="['1', '3']" v-for="i in 7" :key="i" @select="jump">
              <el-menu-item index="1">蔬菜</el-menu-item>
              <el-menu-item index="4">瓜果</el-menu-item>
        </el-menu>
      </el-aside>

      <el-container>
        <el-header height="100px">
          <img src="../../public/image/53436f8f1f04085e413f7f956c4be90.jpg" alt="" height="100px" width="100%">
        </el-header>

        <el-main>
          <router-view></router-view>
        </el-main>

      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  name: "FenView",
  data() {
    return {};
  },
  props: {},

  components: {},

  created() {},

  mounted() {},

  methods: {
    jump(value){
      if (value == 1){
        this.$router.push("/two")
      }
    }
  },

  computed: {},

  watch: {},

  directives: {},

  filters: {},
};
</script>

<style scoped >
  .el-header {
    /* background-color: #B3C0D1; */
    /* color: #333; */
    /* line-height: 60px; */
    height: 400px;
    
  }
  
  .el-aside {
    color: #333;
  }
</style>
